import { FC } from 'react'
import { Typography, Radio, Space } from 'antd'
import PropComponent from './PropComponent'
const { Paragraph } = Typography
export type propsType = {
  title?: string
  isVertical?: boolean
  options?: Array<{ value: string; text: string }>
  value?: string
  disabled?: boolean
}

const questionRadio: FC<propsType> = props => {
  const {
    title = '单选',
    isVertical = false,
    options = [
      { text: '选项一', value: '1' },
      { text: '选项二', value: '2' },
      { text: '选项三', value: '3' },
    ],
    value = '',
  } = props
  return (
    <div>
      <Paragraph strong>{title}</Paragraph>
      <Radio.Group value={value}>
        <Space direction={isVertical ? 'vertical' : 'horizontal'}>
          {options.map(item => (
            <Radio key={item.value} value={item.value}>
              {item.text}
            </Radio>
          ))}
        </Space>
      </Radio.Group>
    </div>
  )
}

export const questionRadioConfig = {
  title: '单选',
  type: 'questionRadio',
  PropComponent,
  Component: questionRadio,
}

export default questionRadio
